<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    
</body>
<script>
    // promise 是什么？
    // 他是一个异步编程的解决方案 本身是同步 存放异步的容器  也可以说他是一个类 或者一个构造函数

    // promise 他接受一个函数作为参数  该函数又接受2个参数  resolve  reject
    // promise 他有三种状态 分别是进行中 （pending） 已成功 （fullfiled） 已失败 （rejected）

    // resolve 的作用 就是将promise的 状态从进行中 变成  已成功
    // reject 的作用 就是将promise的 状态从进行中 变成  已失败
    // promise这个单词就是承诺允诺的意思
    // 无论是成功或者失败都已经执行结束 不可能中途停止

    // promise的原型上有很多方法  .then  .catch  .finally .race all
    // .then的第一个参数就是获取resolve方法传递过来的数据，他的第二个参数 是获取reject传递过来的数据
    // .catch的第一个参数就是获取reject方法传递过来的数据

    // let promise = new Promise((resolve,reject)=>{
    //     // resolve('我是成功的数据')
    //     reject('我是失败的数据')
    // })
    // console.log(promise);
    // promise.then(res=>{
    //     console.log(res);
    // }).catch(err=>{
    //     console.log(err);
    // })

    // promise 可以做什么？  封装我们原生的ajax 对axios二次封装   封装uni.request  可以用来封装我们的网络请求
    // 封装完之后可以进行.then .catch操作

    // 原生xhr  发送请求

    // 第一步创建xhr对象

    // let xhr = new XMLHttpRequest()

    // // open()  方法有三个参数   第一个参数是请求方式  第二个参数是请求地址  第三个参数是否开启异步
    // xhr.open('get','https://api-hmugo-web.itheima.net/api/public/v1/home/swiperdata',true)
    // xhr.send()
    // xhr.onreadystatechange = function(){
    //     if(xhr.readyState == 4){
    //         // xhr.status 状态在200-300直接都代表成功
    //         if(xhr.status == 200){
    //             console.log(JSON.parse(xhr.responseText));
          
    //         }
    //     }
    // }

    // 封装原生ajax

    function ajax(methods,url){
        return new Promise((resolve,reject)=>{
            //1 存放请求
            let xhr = new XMLHttpRequest()
            console.log(xhr);
                // open()  方法有三个参数   第一个参数是请求方式  第二个参数是请求地址  第三个参数是否开启异步
            //    2.打开与服务器的连接
                xhr.open(methods,url,true)
                // 3.发送数据
                xhr.send()
                // 4. 监听 状态改变事件
                xhr.onreadystatechange = function(){
                    if(xhr.readyState == 4){
                        // xhr.status 状态在200-300直接都代表成功
                        if(xhr.status == 200){
                            resolve(JSON.parse(xhr.responseText))
                        }else{
                            reject('请求失败')
                        }
                    }
                }

        })

    }
    ajax('get','https://api-hmugo-web.itheima.net/api/public/v1/home/swiperdata').then(res=>{
        console.log(res);
    }).catch(err=>{
        console.log(err);
    })







    






</script>
</html>